<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@include file="/WEB-INF/template/common/taglibs.jspf" %>
<es:contentHeader/>

<t:base type="jquery,jquery-ui-bootstrap:bootstrap,jquery-ui-bootstrap:jquery-ui,query-ui-bootstrap:jquery.layout,jquery-ui-bootstrap:font-awesome"></t:base>
<t:base type="jquery-ui-bootstrap:jquery.blockUI,jquery-ui-bootstrap:bootstrap.file-input,bootstrap-datetimepicker,nicescroll,jqueryValidate,application"></t:base>

<style type="text/css">
    .error{
        color:red;
    }
</style>

<div class="panel">
    <ul class="nav nav-tabs">
        <shiro:hasPermission name="sys:user:create">
            <c:if test="${op eq '新增'}">
                <li ${op eq '新增' ? 'class="active"' : ''}>
                    <a href="<%=request.getContextPath()%>/admin/sys/user/create">
                        <i class="icon-file-alt"></i>
                        新增
                    </a>
                </li>
            </c:if>
        </shiro:hasPermission>

        <c:if test="${not empty m.id}">
            <li ${op eq '查看' ? 'class="active"' : ''}>
                <a href="<%=request.getContextPath()%>/admin/sys/user/${m.id}">
                    <i class="icon-eye-open"></i>
                    查看
                </a>
            </li>
            <shiro:hasPermission name="sys:user:update">
                <li ${op eq '修改' ? 'class="active"' : ''}>
                    <a href="<%=request.getContextPath()%>/admin/sys/user/${m.id}/update">
                        <i class="icon-edit"></i>
                        修改
                    </a>
                </li>
            </shiro:hasPermission>
            <shiro:hasPermission name="sys:user:delete">
                <li ${op eq '删除' ? 'class="active"' : ''}>
                    <a href="<%=request.getContextPath()%>/admin/sys/user/${m.id}/delete">
                        <i class="icon-trash"></i>
                        删除
                    </a>
                </li>
            </shiro:hasPermission>
        </c:if>
    </ul>

    <form:form id="editForm" method="post" commandName="m" cssClass="form-inline form-horizontal form-small">
        <es:showGlobalError commandName="m"/>
        <form:hidden path="id"/>
        <form:hidden path="deleted"/>
        <form:hidden path="salt"/>
        <div id="baseinfo">
            <h4 class="hr">用户基本信息</h4>
            <div class="control-group span4">
                <form:label path="employeeId" cssClass="control-label">员工编号</form:label>
                <div class="controls">
                    <form:input path="employeeId" placeholder="请输入5位的员工编号" maxlength="5" id="employeeId"/>
                </div>
            </div>
            <div class="control-group span4">
                <form:label path="fullName" cssClass="control-label">姓名</form:label>
                <div class="controls">
                    <form:input path="fullName" placeholder="请输入您的真实姓名"/>
                </div>
            </div>
            <div class="control-group span4">
                <form:label path="username" cssClass="control-label">用户名</form:label>
                <div class="controls">
                    <form:input path="username" id="username" placeholder="2到20个汉字、字母、数字或下划线"/>
                    <span id="errorTip" class="error"></span>
                </div>
            </div>

            <div class="control-group span4">
                <form:label path="email" cssClass="control-label">邮箱</form:label>
                <div class="controls">
                    <form:input path="email" id="email" cssClass="validate[required,custom[email],ajax[ajaxCall]]"
                                placeholder="yan@163.com"/>
                </div>
            </div>

            <div class="control-group span4">
                <form:label path="mobilePhoneNumber" cssClass="control-label">手机号</form:label>
                <div class="controls">
                    <form:input path="mobilePhoneNumber" name="mobilePhoneNumber"
                                cssClass="validate[required,custom[mobilePhoneNumber],ajax[ajaxCall]]"
                                placeholder="如13512345678"/>
                </div>
            </div>
            <c:choose>
                <c:when test="${op eq '新增'}">
                    <div class="control-group span4">
                        <form:label path="password" cssClass="control-label">初始密码</form:label>
                        <div class="controls">
                            <form:password path="password" cssClass="validate[required,minSize[5],maxSize[100]]"
                                           placeholder="请输入至少5位的初始密码"/>
                        </div>
                    </div>
                </c:when>
                <c:otherwise>
                    <%--<form:hidden path="password"/>--%>
                </c:otherwise>
            </c:choose>
            <div class="clearfix"></div>
            <div class="control-group span4">
                <form:label path="admin" cssClass="control-label">是否管理员</form:label>
                <div class="controls inline-radio">
                    <form:radiobuttons path="admin" items="${booleanList}" itemLabel="info" itemValue="value"
                                       cssClass="validate[required]"/>
                </div>
            </div>

            <div class="control-group span4">
                <form:label path="status" cssClass="control-label">状态</form:label>
                <div class="controls inline-radio">
                    <form:radiobuttons path="status" items="${statusList}" itemLabel="info" itemValue="code"
                                       cssClass="validate[required]"/>
                </div>
            </div>
        </div>

        <%--<c:set var="displayOrganizationJobs" value="${displayOrganizationJobs}"/>--%>
        <%--<%@include file="/WEB-INF/template/admin/sys/organization/selectOrganizationAndJob.jspf" %>--%>
        <%--<%@include file="/WEB-INF/template/admin/sys/organization/selectDomicile.jspf" %>--%>

        <c:if test="${op eq '新增'}">
            <c:set var="icon" value="icon-file-alt"/>
        </c:if>
        <c:if test="${op eq '修改'}">
            <c:set var="icon" value="icon-edit"/>
        </c:if>
        <c:if test="${op eq '删除'}">
            <c:set var="icon" value="icon-trash"/>
        </c:if>

        <div class="control-group left-group">
            <div>
                <button type="submit" id="sub" class="btn btn-primary">
                    <i class="${icon}"></i>
                        ${op}
                </button>
                <a href="javascript:self.location=document.referrer;" class="btn">
                    <i class="icon-reply"></i>
                    返回
                </a>
            </div>
        </div>
    </form:form>
</div>
<es:contentFooter/>
<%@include file="/WEB-INF/template/common/import-zTree-css.jspf" %>
<%@include file="/WEB-INF/template/common/import-zTree-js.jspf" %>
<%@include file="/WEB-INF/template/common/admin/import-sys-js.jspf" %>

<script type="text/javascript">
    $(function () {
        <c:choose>
        <c:when test="${op eq '删除'}">
        //删除时不验证 并把表单readonly
        $.app.readonlyForm($("#editForm"), false);
        $.sys.organization.removeOrganizationBtn();
        $.sys.organization.removeDomicileBtn();
        </c:when>
        <c:when test="${op eq '查看'}">
        $.app.readonlyForm($("#editForm"), true);
        $.sys.organization.removeOrganizationBtn();
        $.sys.organization.removeDomicileBtn();
        </c:when>
        <c:otherwise>
        </c:otherwise>
        </c:choose>
        $.sys.organization.initSelectForm("organizationId", "jobId", "domicileId");
    });

    jQuery.validator.addMethod("isMobile", function(value, element) {
        var length = value.length;
        var mobile = /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})$/;
        return this.optional(element) || (length == 11 && mobile.test(value));
    });

    $(function () {
        $("#editForm").validate({
            rules: {
                username: {
                    required: true,
                    rangelength:[2,20],
                    remote: {
                        url: "<%=request.getContextPath()%>/admin/sys/user/validate",
                        type: "post",
                        dataType: "json",
                        data: {
                            username: function () {
                                return $("#username").val();
                            },
                            id:$("#id").val(),
                        },
                        dataFilter: function (data, type) {
                            if (data == "pass")
                                return true;
                            else
                                return false;
                        }
                    }
                },
                email: {
                    required: true,
                    email:true,
                    remote: {
                        url: "<%=request.getContextPath()%>/admin/sys/user/validate",
                        type: "post",
                        dataType: "json",
                        data: {
                            email: function () {
                                return $("#email").val();
                            },
                            id:$("#id").val(),
                        },
                        dataFilter: function (data, type) {
                            if (data == "pass")
                                return true;
                            else
                                return false;
                        }
                    }
                },
                mobilePhoneNumber: {
                    required: true,
                    isMobile:true,
                    remote: {
                        url: "<%=request.getContextPath()%>/admin/sys/user/validate",
                        type: "post",
                        dataType: "json",
                        data: {
                            mobilePhoneNumber: function () {
                                return $("#mobilePhoneNumber").val();
                            },
                            id:$("#id").val(),
                        },
                        dataFilter: function (data, type) {
                            if (data == "pass")
                                return true;
                            else
                                return false;
                        }
                    }
                },
                password: {
                    required: true,
                    minlength:5,
                },
                fullName:{
                    required: true,
                    minlength:2,
                    maxlength:20,
                },
                employeeId:{
                    remote: {
                        url: "<%=request.getContextPath()%>/admin/sys/user/validate",
                        type: "post",
                        dataType: "json",
                        data: {
                            employeeId: function () {
                                return $("#employeeId").val();
                            },
                            id:$("#id").val(),
                        },
                        dataFilter: function (data, type) {
                            if (data == "pass")
                                return true;
                            else
                                return false;
                        }
                    },
                    required:true,
                    digits:true,
                    minlength:5,
                    maxlength:5,
                }
            },
            messages: {
                username: {
                    required: "请输入用户名",
                    rangelength: "5-20个汉字，字母或下划线",
                    remote: "输入的用户名已经存在"
                },
                email: {
                    required: "请输入邮箱",
                    email:"输入正确的邮箱",
                    remote: "邮箱已注册"
                },
                mobilePhoneNumber: {
                    required: "请输入手机号",
                    remote: "手机号已注册",
                    isMobile:"输入正确的手机号"
                },
                password: {
                    required: "请输入密码",
                    minlength: "密码长度至少为5"
                },
                employeeId:{
                    digits:"只能输入5位数字",
                    required:"员工编号不能为空",
                    remote:"该员工编号已经使用"
                },
                fullName:{
                    required:"请输入您的姓名"
                }
            }
        });
    });
    $(function () {
        $("#editForm").submit(function () {
            var flag = $("#editForm").valid();
                if (!flag) {
                    return false;
                }
        });
    });
</script>